import React from 'react'
// ===================================================================== Temp
import SearchForm from '#cpt/temp/SearchForm'
import Table from '#cpt/temp/Table'
import TableControls from '#cpt/temp/TableControls'
import Controls from '#cpt/temp/Controls'
// ===================================================================== global declare
const { $fn, $Lazy, $http } = window
// ===================================================================== Lazy
const Page 				= $Lazy.load(()=>import('#tp/page/page-container'))
const $cache 			= $Lazy.file(()=>import('#private/cache-api'))
const TableModal 		= $Lazy.state(()=>import('./cpt/table-modal'))
// ===================================================================== data
const  kindStatus = [
	{ name:'开启', 		value:'2' },
	{ name:'审核中', 	value:'1' },
	{ name:'草稿', 		value:'0' },
]
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
		selectedKeys:[],
		selectedRows:[],
		// 搜索表单列表
		forms : [
			{ label: '状态',		name: 'kind_status', type:'select', data: kindStatus },
			{ label: '项目代码',  	name: 'kind_code'},
			{ label: '项目全称',  	name: 'kind_name'},
			{ label: '助记码',  		name: 'debit_code'},
			{ label: '项目分类',		name: 'category', 	type:'select', loading:true},
			{ label: '岗位',			name: 'project_id', type:'select', loading:true },
			{ label: '备注',  		name: 'memo'},
			{ label: '系统分类',		name: 'sys_category',	type:'treeSelect',	checkable:false,	multiple:false,	loading:true },
		],
		// 提交表单列表
		formData : [
			{ label: '项目名称',		name: 'kind_name', 	full:true, disabled:true },
			{ label: '公司名称',  	name: 'comp_id', 	full:true, type:'select', loading:true, idStr:'uuid', nameStr:'company_name'}
		]
	}
	
	model = {}
	query = {}
	
	componentDidMount(){
		const { kind_code } =  $fn.query()
		 
		this.query = this.queryModel = { kind_code }
		
		this.fetch()
		
		$fn.fresh.on(this.fetch)
	}
	
	componentWillUnmount(){
		$fn.fresh.remove()
	}
	
	// 获取下拉数据
	getSelect = () => {
		const { forms } = this.state
		
		$cache.then( async f => {
			// 岗位
			$fn.setRow(forms, 'project_id', await f.getCache({api:'gang_wei'}))
			// 回顾
			$fn.setRow(forms, 'category',  await f.project_classify)
			// 系统分类
			const _data = await f.getCache({ api:'conf-system-category/select', refresh: true })
			$fn.setRow(forms, 'sys_category', _data)
			// 
			const { kind_code } = this.query
			if(kind_code){
				this.searchFormRef.setValue({ kind_code })
			}
			//
			this.setState({ forms })
		})
	}
	// 获取弹窗下拉数据
	getModalSelect = async () => {
		const { formData } = this.state
		$fn.setModalRows(formData, 'comp_id', ()=>{
			$cache.then( async f => {
				// 公司名称
				$fn.setRow(formData, 'comp_id',  await f.getCache({ api:'company'}))
				//
				this.setState({ formData })
			})
		})
	}
	
	// paging
	fetch = () => $fn.fetch.call(this,'kind-info/index')
	
	// 表单
	cols = [
		{ title: '状态',			dataIndex: 'kind_status', 		width:80, render: text => $fn.getState(kindStatus, text) },
		{ title: '项目分类', 		dataIndex: 'category_name', 	width:80 },
		{ title: '项目代码', 		dataIndex: 'kind_code', 		width:80 },
		{ title: '项目名称', 		dataIndex: 'kind_name', 		width:250 },
		{ title: '项目属性', 		dataIndex: 'kind_type_name', 	width:100 },
		{ title: '检测方法', 		dataIndex: 'check_method_name', width:150 },
		{ title: '岗位', 			dataIndex: 'job_name', 			width:100 },
		{ title: '助记码', 			dataIndex: 'debit_code', 		width:80 },
		{ title: '价格', 			dataIndex: 'total_price', 		...$fn.table.num },
		{ title: '项目排序', 		dataIndex: 'sort', 				...$fn.table.num },
		{ title: '备注', 			dataIndex: 'memo', 				width:200 },
		{ title: '系统分类', 		dataIndex: 'cate_name', 		width:200 },
		TableControls.controls.call(this,{ width: 80 })
	]
	// 表格操作按钮
	table_controls = (text,{ uuid, category}) => {
		return [
			TableControls.click.call(this,'编辑',()=>{
				const url = {
					'25001' : 'set-single-project',		// 单一项目
					'25002' : 'new-add-project',		// 从属项目
					'25003' : 'set-group-project',		// 组合项目
					'25004' : 'set-marketing-project'	// 营销项目
				}
				
				const path = url[category]
				if(path){
					$fn.pushTo(this, `${path}?kind_id=${uuid}`)
				}else{
					$fn.toast('无对应项目分类')
				}
				
			},{ ghost:true })
		]
	}
	// 获取不现按钮的 kind_id
	getKindId = (api,push) => {
		$http.submit(null,api,{ isPull:true }).then( ({ kind_id }) => {
			this.kind_id = kind_id
			push?.(kind_id)
		})
	}
	
	push = (url, kind_id) => $fn.pushTo(this,`${url}?kind_id=${kind_id}`)
	// 操作按钮
	controls = () => {
		const { selectedRows } = this.state
		return [
			Controls.push.call(this,'设置单一项目', ()=>{
				this.getKindId('kind-info/add', kind_id => this.push('set-single-project',kind_id) )
			}),
			Controls.push.call(this,'新增从属项目', ()=>{
				this.getKindId('kd-subordinate-set/add',  kind_id => this.push('new-add-project',kind_id) )
			}),
			Controls.push.call(this,'设定组合项目', ()=>{
				this.getKindId('kd-combin-project/add', kind_id => this.push('set-group-project',kind_id) )
			}),
			Controls.push.call(this,'设置营销项目', ()=>{
				this.getKindId('kd-market/add', kind_id => this.push('set-marketing-project',kind_id) )
			}),
			// 导出
			Controls.exports.call(this, 'kind-info/index', { label: '全部导出' }),
			Controls.exports.call(this, 'kind-info/index', { label: '单一项目导出', code: '', param: { export_type: 2 } } ),
			Controls.click.call(this, '更新公式', ()=> {
				$http.pull(null, 'result-unit-item/changeFormulaSubKind')
				$http.pull(null, 'result-unit-item/changeFormula2Kind', { loading:true, loadingText:'更新公式中' })
			}),
			Controls.click.call(this, '复制项目到', ()=>{
				this.modal.open(selectedRows)
			},{ disabled: !$fn.hasArray(selectedRows) || ( $fn.hasArray(selectedRows) && +selectedRows[0]['kind_status'] !== 2) }),
			
			this.query.kind_code && Controls.back.call(this) 	// 返回
			
			// this.query.kind_code && Controls.click.call(this,'返回',()=>{ $fn.fresh.back.call(this,'onModelRefresh') }, { ghost:true })
		]
	}
	
	render(){
		return (
			<>
				<Page title='检测项目' controls={this.controls()}>
					{/* 搜索 */}
					{ SearchForm.call(this, { onForm: this.getSelect }) }
					{/* 表格 */}
					{ Table.call(this,{type:1}) }
				</Page>
				{/* 复制项目到 */}
				<TableModal onRef={ref=>this.modal=ref} />
			</>
		)
	}
}

export default Index